<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>仿QQ彩贝</title>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>

<!--顶部导航-->
<div class="head">
    <div class="wrap">
        <ul>
            <li><a href="javascript:void(0)">赚彩贝</a></li>
            <li><a href="javascript:void(0)">花彩贝</a></li>
        </ul>
    </div>
</div>

<!--logo&导航-->
<!--<div class="logo">-->
    <!--<ul class="wrap">-->
        <!--<li><a href="http://cb.qq.com/"><img src="img/logo_170x46.png"/></a></li>-->
        <!--<li><a href="javascript:void(0)">返利商城 / 商旅频道</a></li>-->
        <!--<li><a href="javascript:void(0)">积分商城</a></li>-->
        <!--<li><a href="javascript:void(0)">了解彩贝 / 彩贝活动 / 个人中心</a></li>-->
        <!--<li>-->
            <!--<div></div>-->
            <!--<div></div>-->
            <!--<div></div>-->
        <!--</li>-->
    <!--</ul>-->
<!--</div>-->
<header class="top">
    <nav class="nav">
        <div class="wrap clearfix">
            <a href="#" class="left logo"><img src="img/logo_170x46.png" alt=""/></a>
            <div class="left nav-menu">
                <div class="nav-menu-a">
                    <span></span>
                    <ul class="clearfix">
                        <li><a href="">返利商城</a></li>
                        <li><a href="">商旅频道</a></li>
                    </ul>
                </div>
                <div class="nav-menu-b">
                    <span></span>
                    <ul class="clearfix">
                        <li><a href="">积分商城</a></li>
                    </ul>
                </div>
                <div class="nav-menu-c">
                    <ul class="clearfix">
                        <li><a href="">了解彩贝</a></li>
                        <li><a href="">彩贝活动</a></li>
                        <li><a href="">个人中心</a></li>
                    </ul>
                </div>
            </div>
            <div class="right nav-right">
                <a href=""></a>
                <a href=""></a>
                <a href=""></a>
            </div>
        </div>
    </nav>
</header>

<!--内容-->
<div class="content">
    <div class="wrap">
        <div class="content-left left">
            <div class="h3">
                <h3>购物返彩贝商家</h3>
            </div>
            <ul class="list">
                <li>
                   <h5>数码家电</h5>
                    <p><a href="">京东</a><a href="">易迅</a><a href="">苏宁易购</a></p>
                    <span>&gt;</span>
                    <div class="hidden">1</div>
                </li>
                <li>
                    <h5>食品酒水</h5>
                    <p><a href="">美食特产</a><a href="">酒水茶叶</a><a href="">蛋糕预定</a></p>
                    <span>&gt;</span>
                    <div class="hidden">2</div>
                </li>
                <li>
                    <h5>商旅出行</h5>
                    <p><a href="">酒店预约</a><a href="">机票预订</a><a href="">商旅综合</a></p>
                    <span>&gt;</span>
                    <div class="hidden">3</div>
                </li>
                <li>
                    <h5>日用百货</h5>
                    <p><a href="">飞飞商场</a><a href="">图书教育</a><a href="">百货</a></p>
                    <span>&gt;</span>
                    <div class="hidden">4</div>
                </li>
                <li>
                    <h5>男女服装</h5>
                    <p><a href="">时尚女装</a><a href="">精品男装</a><a href="">男女内衣</a></p>
                    <span>&gt;</span>
                    <div class="hidden">5</div>
                </li>
                <li>
                    <h5>鞋包配饰</h5>
                    <p><a href="">潮流女鞋</a><a href="">商务男鞋</a><a href="">时尚包包</a></p>
                    <span>&gt;</span>
                    <div class="hidden">6</div>
                </li>
                <li>
                    <h5>美容美妆</h5>
                    <p><a href="">天天网</a><a href="">美妆商场</a><a href="">眼镜美瞳</a></p>
                    <span>&gt;</span>
                    <div class="hidden">7</div>
                </li>
                <li>
                    <h5>母婴保健</h5>
                    <p><a href="">壹药网</a><a href="">康爱多</a><a href="">医药保健</a></p>
                    <span>&gt;</span>
                    <div class="hidden">8</div>
                </li>
                <li>
                    <h5>娱乐生活</h5>
                    <p><a href="">游戏</a><a href="">彩票</a><a href="">演出票务</a></p>
                    <span>&gt;</span>
                    <div class="hidden">9</div>
                </li>
            </ul>
        </div>

        <div class="content-middle left">
            <div class="slide">
                <ul class="slide-img">
                    <li><a href=""><img src="img/focus1.jpg" alt=""/></a></li>
                    <li><a href=""><img src="img/focus2.jpg" alt=""/></a></li>
                    <li><a href=""><img src="img/focus3.jpg" alt=""/></a></li>
                    <li><a href=""><img src="img/focus4.jpg" alt=""/></a></li>
                </ul>
                <ul class="slide-page">
                    <li>办卡领取双肩包</li>
                    <li>音乐消暑 冰爽一夏</li>
                    <li>早市天黑黑四周年庆</li>
                    <li>腾讯积分会员店</li>
                </ul>
            </div>

            <div class="ad-pic">
                <div class="footLeft left"><a href=""><img src="img/m1.jpg" alt=""/></a></div>
                <div class="footRight right">
                    <div class="footRight-top">
                        <a href=""><img src="img/m2.jpg" alt=""/></a>
                        <a href=""><img src="img/m3.jpg" alt=""/></a>
                    </div>
                    <div class="footRight-foot">
                        <a href=""><img src="img/m4.jpg" alt=""/></a>
                        <a href=""><img src="img/m5.jpg" alt=""/></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-right right">
            <div class="content-right-top">
                <div class="search-box">
                    <h3>高级搜索</h3>
                    <input type="text" placeholder="请输入关键字"/>
                    <div class="select"></div>
                    <p><button>搜索</button></p>
                </div>
                <div class="search-news">
                    <p>彩贝能做什么？</p>
                    <ul>
                        <li><a href="">100彩贝=￥1.00元</a></li>
                        <li><a href="">尊享优质商旅预订服务</a></li>
                        <li><a href="">可兑换近千款精美礼品</a></li>
                    </ul>
                </div>
            </div>
            <div class="content-right-bottom">
                <div class="entrance">
                    <p>快速入口</p>
                    <p><a href="">商家导航</a><a href="">拍拍返利</a></p>
                    <p><a href="">腾讯业务</a><a href="">娱乐生活</a></p>
                    <p><a href="">拾贝任务</a><a href="">兑换码激活</a></p>
                </div>
                <div class="wechat">
                    <p>关注彩贝微信有惊喜</p>
                    <img src="img/showqrcode.jpg" width="80px"/>
                </div>
            </div>
        </div>
    </div>
</div>


<script src="js/jquery.min-1.8.3.js"></script>
<script src="js/demo.js"></script>
</body>
</html>